<template>
	<div>
		<div class="date">
			<el-select v-model="isType" placeholder="请选择" size="mini" @change="week">
				<el-option value="1" label="工作日"></el-option>
				<el-option value="3" label="每天"></el-option>
			</el-select>
			<div class="week base-flex" v-if="weekIndex == 1">
				<el-checkbox-group v-model="weekCities" @change="changeWeek">
					<el-checkbox
						v-for="(item, index) in weekArr"
						:key="index"
						:label="item.label"
						border
						size="mini"
						>{{ item.label }}</el-checkbox
					>
				</el-checkbox-group>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: 'service-time',
	data() {
		return {
			isType: '',
			weekIndex: '',
			weekCities: ['周一', '周二', '周三', '周四', '周五', '周六'],
			weekArr: [
				{
					label: '周一',
					value: 1
				},
				{
					label: '周二',
					value: 2
				},
				{
					label: '周三',
					value: 3
				},
				{
					label: '周四',
					value: 4
				},
				{
					label: '周五',
					value: 5
				},
				{
					label: '周六',
					value: 6
				},
				{
					label: '周日',
					value: 7
				}
			],
			dataObj: {}
		};
	},
	props: {
		dataTime: [String]
	},
	mounted() {
		if (this.dataTime) {
			if (this.dataTime == '每天') {
				this.isType = '3';
				this.weekIndex = '3';
			} else {
				this.isType = '1';
				this.weekIndex = '1';
				this.weekCities = this.dataTime.split(',');
			}
		} else {
			this.isType = '';
			this.weekIndex = '';
		}
	},

	methods: {
		week(e) {
			let dataText = '';
			if (e == 1) {
				dataText = this.weekCities.join(',');
			} else if (e == 3) {
				dataText = '每天';
			}
			this.$emit('resolve', dataText);
			this.weekIndex = e;
		},
		changeWeek(e) {
			let txt = e.join(',');
			this.$emit('resolve', txt);
		}
	}
};
</script>
<style lang="scss" scoped>
.date {
	.el-radio {
		margin-right: 20px;
	}
	.week {
		margin-top: 20px;
		.el-checkbox.is-bordered + .el-checkbox.is-bordered {
			margin-left: 0;
		}
	}
}
</style>
